技术经验 • dingxiao • 阅读数:1913 • 2018年7月16日 15:34

尝试在JavaScript中使用MQTT进行命令及图片传输

MQTT发送代码：

      <script>
  
        function publish(topic, message) {
            message = new Paho.MQTT.Message(message);
            message.destinationName = topic;
            message.qos = 0;
            client.send(message);
        }
  
        function Send_Msg(){
  
          var Msg=document.getElementById("msg").value;
  
          publish("dx",Msg);
          //alert("ok"+Msg);
        }
  </script>

MQTT连接及接收代码：

<script>
    
    var img_src = "file:///D:/Work/Python/Prj/PyQT/DX_Test/mqtt1.png"
    var tempGauge;
    var client = new Paho.MQTT.Client("Your_IP",8884, "clientId");  //初始化MQTT客户端

    client.onMessageArrived = function (msg) {

       if(msg.topic == "dx")
       {
         document.querySelector("#meter").value = msg.payloadString; //更新显示
         tempGauge.setValue(msg.payloadString);
         tempGauge.setLedColor(steelseries.LedColor.GREEN_LED); //change status LED to GREEN on broker connection
       }

    };

    function init() {

      tempGauge = new steelseries.Radial('gaugeCanvas', {
        gaugeType: steelseries.GaugeType.TYPE4,
        minValue:-15,
        maxValue:50,
        size: 250,
        frameDesign: steelseries.FrameDesign.STEEL,
        knobStyle: steelseries.KnobStyle.STEEL,
        pointerType: steelseries.PointerType.TYPE6,
        lcdDecimals: 0,
        section: null,
        area: null,
        titleString: 'Temperature',
        unitString: 'C',
        threshold: 100,
        lcdVisible: true,
        lcdDecimals: 2
         });
      tempGauge.setValue(''); //gives a blank display 'NaN' until broker has connected
      tempGauge.setLedColor(steelseries.LedColor.RED_LED); //set the LED RED until connected
    }

    client.connect({
      onSuccess: function () {
        //client.subscribe("dx");  //订阅指定主题
        client.subscribe("dx");  //订阅指定主题
      },
  });
</script>

名字：

邮箱：

评论：

验证码:

发表

暂无评论